//数据渲染
function showData(pageNum) {
  $('tbody').html('')
  let showData = resultData.slice((pageNum - 1) * eachNum, pageNum * eachNum)
  showData.forEach(item => {
    $('tbody').append(`
      <tr>
        <th><input type="checkbox" class="checks" onclick='ischecks()'></th>
        <td>${item.jykh}</td>
        <td>${item.yhm}</td>
        <td>${item.jyts}</td>
        <td>${item.tsbh}</td>
        <td>${item.zz}</td>
        <td>${item.jyrq}</td>
        <td>${item.yhrq}</td>
        <td>${item.cqts}</td>
        <td>${item.sfds}</td>   
        <td>
          <span class="change" data-toggle="modal"
          data-target="#myModal" onclick='xiugaijy(this)'>编辑</span>
          <span>|</span>
          <span class='del' data-toggle="modal"
          data-target="#myModal" onclick='sureDel(this)'>删除</span>
        </td>
      </tr>
    `)
  })
}
//编辑借阅弹框
function xiugaijy(obj) {
  let objval = $(obj).parent().siblings('td')
  $('.modal-content').html(`
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
          aria-hidden="true">&times;</span></button>
      <h4 class="modal-title" id="myModalLabel">修改信息</h4>
    </div>
    <div class="modal-body">
      <div class="xzsr"><span>借阅卡号</span><input type="text" disabled value=${objval.eq(0).text()}></div>
      <div class="xzsr"><span>用户名</span><input type="text" value=${objval.eq(1).text()}></div>
      <div class="xzsr"><span>超期图书</span><input type="text" value=${objval.eq(2).text()}></div>
      <div class="xzsr"><span>图书编号</span><input type="text" value=${objval.eq(3).text()}></div>
      <div class="xzsr"><span>作者</span><input type="text" value=${objval.eq(4).text()}></div>
      <div class="xzsr rqxz"><span>借阅日期</span><input type="date" value=${objval.eq(5).text()}></div>
      <div class="xzsr rqxz"><span>应还书日期</span><input type="date" value=${objval.eq(6).text()}></div>
      <div class="xzsr"><span>是否丢失</span>
        <select name="" id="xjselect" value=${objval.eq(8).text()}>
          <option style="display:none" selected>${objval.eq(8).text()}</option>
          <option value="">是</option>
          <option value="">否</option>
        </select>
      </div>
    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
      <button type="button" class="btn btn-primary" data-dismiss="modal" onclick="changeData()">确定</button>
    </div>`)
}
//修改借阅数据
function changeData() {
  for (let i = 0; i < bookData.length; i++) {
    if (bookData[i].jykh == $('.xzsr').eq(0).children().last().val()) {
      bookData[i].jykh = $('.xzsr').eq(0).children().last().val()
      bookData[i].yhm = $('.xzsr').eq(1).children().last().val()
      bookData[i].jyts = $('.xzsr').eq(2).children().last().val()
      bookData[i].tsbh = $('.xzsr').eq(3).children().last().val()
      bookData[i].zz = $('.xzsr').eq(4).children().last().val()
      bookData[i].jyrq = $('.xzsr').eq(5).children().last().val()
      bookData[i].yhrq = $('.xzsr').eq(6).children().last().val()
      bookData[i].sfds = $('#xjselect option:selected').text()
    }
  }
  goPage(nowPageNum)
  let allData = JSON.stringify(bookData)
  sessionStorage.setItem('initialData', allData)
}
//确认删除弹框
function sureDel(obj) {
  let objval = $(obj).parent().siblings('td')
  let deljykh = objval.first().text()
  $('.modal-content').html(`
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
          aria-hidden="true">&times;</span></button>
      <h4 class="modal-title" id="myModalLabel">删除借阅</h4>
    </div>
    <div class="modal-body">
      <p>确认删除借阅卡号为：${deljykh}&nbsp的借阅数据吗？</p>
    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
      <button type="button" class="btn btn-primary" data-dismiss="modal" onclick="shanchujy(${deljykh})">确定</button>
    </div>`)
}
//删除借阅
function shanchujy(deldata) {
  for (let i = 0; i < bookData.length; i++) {
    if (bookData[i].jykh == deldata) {
      bookData.splice(i, 1)
    }
  }
  for (let j = 0; j < resultData.length; j++) {
    if (resultData[j].jykh == deldata) {
      resultData.splice(j, 1)
    }
  }
  if (maxPage > Math.ceil(resultData.length / eachNum)) {
    prePage()
  }
  maxPage = Math.ceil(resultData.length / eachNum)
  showPage(maxPage)
  goPage(nowPageNum)
  let allData = JSON.stringify(bookData)
  sessionStorage.setItem('initialData', allData)
}
//勾选框选中时改变批量删除按钮样式
function ischecks() {
  if ($('.checks').is(':checked')) {
    $('#piliangdel').css({
      'color': 'black'
    })
    $('#piliangdel').removeAttr('disabled')
  } else {
    $('#piliangdel').css(
      'color', 'rgb(209, 209, 209)'
    )
    $('#piliangdel').attr('disabled', "false")
  }
}
//批量删除确认弹框
function surePlDel() {
  $('.modal-content').html(`
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
          aria-hidden="true">&times;</span></button>
      <h4 class="modal-title" id="myModalLabel">删除借阅</h4>
    </div>
    <div class="modal-body">
      <p>确认删除选中的借阅数据吗？</p>
    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
      <button type="button" class="btn btn-primary" data-dismiss="modal" onclick="plshanchu()">确定</button>
    </div>`)
}
//批量删除
function plshanchu() {
  $('.checks').not('#biaotou').each(function () {
    if ($(this).is(':checked')) {
      let deldata = $(this).parent().next().text()
      for (let i = 0; i < bookData.length; i++) {
        if (bookData[i].jykh == deldata) {
          bookData.splice(i, 1)
        }
      }
      for (let j = 0; j < resultData.length; j++) {
        if (resultData[j].jykh == deldata) {
          resultData.splice(j, 1)
        }
      }
    }
  })
  if (maxPage > Math.ceil(resultData.length / eachNum)) {
    prePage()
  }
  maxPage = Math.ceil(resultData.length / eachNum)
  showPage(maxPage)
  goPage(nowPageNum)
  let allData = JSON.stringify(bookData)
  sessionStorage.setItem('initialData', allData)
}
//查询数据
function enquiryData() {
  if ($('#entext').val() != '') {
    resultData = []
    for (let i = 0; i < bookData.length; i++) {
      if (bookData[i].jykh.match($('#entext').val()) ||
        bookData[i].yhm.match($('#entext').val()) ||
        bookData[i].jyts.match($('#entext').val()) ||
        bookData[i].tsbh.match($('#entext').val())) {
        if ($('#enselect').val() == 1 || $('#enselect').val() == 0) {
          resultData.push(bookData[i])
        } else {
          if (bookData[i].sfds == $('#enselect').val()) {
            resultData.push(bookData[i])
          }
        }
      }
    }
  } else if ($('#enselect').val() == "是" || $('#enselect').val() == "否") {
    resultData = []
    for (let j = 0; j < bookData.length; j++) {
      if (bookData[j].sfds == $('#enselect').val()) {
        resultData.push(bookData[j])
      }
    }
  }
  nowPageNum = 1
  maxPage = Math.ceil(resultData.length / eachNum)
  showPage(maxPage)
  goPage(nowPageNum)
}